<template>
  <div>
    <div class="dl">
      <el-col :span="7">
         <el-form>
            <div class="kt">
              <el-input v-model="user" placeholder="请输入内容"></el-input>
              <el-input placeholder="请输入密码" v-model="pwd" show-password></el-input>
            </div>
              <el-button type="primary" @click="onSubmit">登录</el-button>
              <el-button type="primary" @click="onmit">超级登录</el-button>
          </el-form>
      </el-col>
            <video
        style="width:100%;object-fit: fill; position:absolute; height:100%"
        src="../../assets/img/2.mp4"
        controls="controls"
        loop="loop"
        muted
        autoplay
      ></video>
    </div>
  </div>
</template>

<script>
import { login, suplogin } from '../../api/index'
export default {
  data () {
    return {
      user: '',
      pwd: '',
      Token: ''
    }
  },
  methods: {
    onSubmit () {
      login().then(res => {
        if (res.data.code === 200) {
          console.log(res)
          const user = this.user
          this.Token = res.data.data.Token
          localStorage.setItem('user', user)
          localStorage.setItem('Token', this.Token)
          localStorage.setItem('role', 'admin')
          this.$message({
            message: '登录成功',
            type: 'success',
            onClose: () => {
              console.log(this.$route.query.from)
              this.$router.replace(this.$route.query.from)
            }
          })
        }
      })
    },
    onmit () {
      suplogin().then(res => {
        if (res.data.code === 200) {
          console.log(res)
          const user = this.user
          this.Token = res.data.data.Token
          localStorage.setItem('user', user)
          localStorage.setItem('Token', this.Token)
          localStorage.setItem('role', 'aa')
          this.$message({
            message: '登录成功',
            type: 'success',
            onClose: () => {
              console.log(this.$route.query.from)
              this.$router.replace(this.$route.query.from)
            }
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.kt{
  margin: 20px auto;
  width: 300px;
}
.dl{
  overflow: hidden;
}
  .el-form{
    z-index: 1000;
    position:absolute;
    left: 75%;top: 0%;
    // background-color:rgb(253, 253, 253);
  }
</style>
<style type="text/css">
video::-webkit-media-controls {
  display: none !important;
}
</style>
